﻿ <pn:PhoneApplicationPage
    x:Class="PillBox.Client.Views.MedicationDetailsView"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:pn="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
    mc:Ignorable="d" d:DesignHeight="800" d:DesignWidth="480" d:DataContext="{d:DesignData /SampleData/MedicationDetailsViewModelSampleData.xaml}">
    <pn:PhoneApplicationPage.Resources>
        <Storyboard x:Name="ResetPageTransitionList">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ContentGrid" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)">
                <EasingDoubleKeyFrame KeyTime="00:00:00.3" Value="0">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CircleEase EasingMode="EaseIn"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ContentGrid" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.CenterOfRotationX)">
                <EasingDoubleKeyFrame KeyTime="00:00:00.3" Value="0">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CircleEase EasingMode="EaseIn"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
        <Storyboard x:Name="PageTransitionList">
            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ContentGrid" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.RotationY)">
                <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="00:00:00.3" Value="90">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CircleEase EasingMode="EaseIn"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="ContentGrid" Storyboard.TargetProperty="(UIElement.Projection).(PlaneProjection.CenterOfRotationX)">
                <EasingDoubleKeyFrame KeyTime="00:00:00" Value="0"/>
                <EasingDoubleKeyFrame KeyTime="00:00:00.3" Value="0">
                    <EasingDoubleKeyFrame.EasingFunction>
                        <CircleEase EasingMode="EaseIn"/>
                    </EasingDoubleKeyFrame.EasingFunction>
                </EasingDoubleKeyFrame>
            </DoubleAnimationUsingKeyFrames>
            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ContentGrid">
            	<EasingDoubleKeyFrame KeyTime="0" Value="1"/>
            	<EasingDoubleKeyFrame KeyTime="0:0:0.3" Value="0"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </pn:PhoneApplicationPage.Resources>
    <Grid x:Name="ContentGrid" Margin="40,0,30,0">
        <Grid.Projection>
            <PlaneProjection/>
        </Grid.Projection>
    	<Grid.RowDefinitions>
    		<RowDefinition Height="275"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto" MaxHeight="312"/>
    		<RowDefinition Height="Auto"/>
    		<RowDefinition Height="204"/>
    	</Grid.RowDefinitions>
		<Grid Margin="0">
			<Grid.ColumnDefinitions>
				<ColumnDefinition Width="0.518*"/>
				<ColumnDefinition Width="0.482*"/>
			</Grid.ColumnDefinitions>
			<Grid.RowDefinitions>
				<RowDefinition Height="Auto"/>
				<RowDefinition Height="Auto"/>
				<RowDefinition Height="Auto"  />
				<RowDefinition/>
			</Grid.RowDefinitions>
			<TextBlock TextWrapping="Wrap" Style="{StaticResource PhoneTextTitle1Style}" Margin="0,22,0,0" Grid.ColumnSpan="2" Text="PILLBOX" FontSize="16" VerticalAlignment="Bottom"/>
			<TextBlock TextWrapping="NoWrap" Text="{Binding Medication.Name}" Style="{StaticResource PhoneTextTitle1Style}" Margin="0,-16,0,-4" Grid.ColumnSpan="2" Grid.Row="1"/>
			<StackPanel Margin="0,0,0,0" Grid.Row="2" Grid.ColumnSpan="2">
				<StackPanel Orientation="Horizontal">
					<TextBlock TextWrapping="Wrap" Text="dosage" Foreground="White" Margin="0,0,4,0" Style="{StaticResource Phone_DosageTxt}"/>
					<TextBlock TextWrapping="Wrap" Text="{Binding Medication.Dosage}" Margin="4,0,0,0" Style="{StaticResource Phone_DosageTxt}"/>
				</StackPanel>
				<StackPanel Orientation="Horizontal">
					<TextBlock TextWrapping="Wrap" Text="taken by" Foreground="White" Style="{StaticResource Phone_DosageTxt}" Margin="0,0,4,0"/>
					<TextBlock TextWrapping="Wrap" Text="{Binding Medication.DeliveryMethod}" Style="{StaticResource Phone_DosageTxt}" Margin="4,0,0,0"/>
					<TextBlock Text="{Binding Medication.Frequency}" Foreground="White" Style="{StaticResource Phone_DosageTxt}" Margin="4,0,0,0"/>
				</StackPanel>
			</StackPanel>
			<Image Source="{Binding Medication.ImageUri}" HorizontalAlignment="Left" Height="70" VerticalAlignment="Center" Width="70" Grid.Row="3" Margin="8,0,0,0">
				<Image.Effect>
					<DropShadowEffect Opacity="0.75" BlurRadius="10" Direction="280" ShadowDepth="1"/>
				</Image.Effect>
			</Image>
			<Grid Grid.Column="1" Margin="4,0,4,4" Grid.Row="3">
				<Grid.RowDefinitions>
					<RowDefinition Height="Auto" />
					<RowDefinition Height="Auto" />
				</Grid.RowDefinitions>
				<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
					<TextBlock TextWrapping="Wrap" Text="expires" Foreground="White" Style="{StaticResource Phone_DosageTxt}" Margin="0,0,4,0"/>
					<TextBlock TextWrapping="Wrap" Text="{Binding Medication.Expiration}" Style="{StaticResource Phone_DosageTxt}" Margin="4,0,0,0"/>
				</StackPanel>
				<Button
					Content="refill"
					Grid.Row="1"
					Margin="0"
					FontSize="18.667"
					Width="140"
					Height="40"
					FontFamily="Segoe WP"
					Style="{StaticResource PhoneButtonBase}" HorizontalAlignment="Right" BorderThickness="2"/>
			</Grid>
		</Grid>

        <Path
			Data="M0,87 L432,87"
			Stretch="Fill"
			UseLayoutRounding="False"
			Margin="0,16"
			Grid.ColumnSpan="2"
            VerticalAlignment="Bottom"
            Stroke="{StaticResource Phone_DashedLineBrush}"
            Grid.Row="1"/>

        <Grid Margin="0" Grid.Row="2">
			<Grid.RowDefinitions>
				<RowDefinition Height="Auto"  />
				<RowDefinition Height="Auto" MinHeight="50"/>
				<RowDefinition Height="Auto" />
			</Grid.RowDefinitions>
			<StackPanel Orientation="Horizontal">
				<Rectangle
					Width="5"
					Fill="{Binding Medication.Person.ColorBand}" 
					HorizontalAlignment="Right" Height="24"/>
				<TextBlock
					TextWrapping="Wrap"
					Text="{Binding Medication.Person.Name}" 
					Style="{StaticResource PhoneTextTitle2Style}" 
					VerticalAlignment="Top" Margin="10,0,0,0"/>
			</StackPanel>
            <TextBlock TextWrapping="Wrap" Text="{Binding Medication.Description}" d:LayoutOverrides="Width" Style="{StaticResource Phone_DosageTxt}" Margin="0,8,0,0" Grid.Row="1" Foreground="White"/>
            <Button
				Margin="0"
				FontSize="18.667"
				Grid.Row="2"
				Width="140"
				Height="40"
				FontFamily="Segoe WP"
				Style="{StaticResource PhoneButtonBase}" 
				Content="learn more" HorizontalAlignment="Left" BorderThickness="2"/>
		</Grid>

        <Path
			Data="M0,87 L432,87"
			Stretch="Fill"
			UseLayoutRounding="False"
			Margin="0,16"
			Grid.ColumnSpan="2"
            VerticalAlignment="Bottom"
            Stroke="{StaticResource Phone_DashedLineBrush}"
            Grid.Row="3"/>

        <Grid Margin="0" Grid.Row="4">
			<Grid.RowDefinitions>
				<RowDefinition Height="Auto"/>
				<RowDefinition/>
			</Grid.RowDefinitions>
            <TextBlock TextWrapping="Wrap" Style="{StaticResource PhoneTextBodyTextStyle}" Margin="0" FontSize="21.333" FontFamily="Segoe WP" d:LayoutOverrides="Width" Text="prescribed by"/>
            <StackPanel
                Margin="0"
                Orientation="Horizontal"
                d:LayoutOverrides="Height"
                Grid.Row="1" VerticalAlignment="Top">
                <Image
                    Source="{Binding Medication.Prescriber.ImageUri}"
                    Height="40"
                    Width="40"/>
				<TextBlock TextWrapping="Wrap" Text="{Binding Medication.Prescriber.Name}" Style="{StaticResource PhoneTextTitle1Style}" FontSize="48" Height="70" Margin="15,0,0,0"/>
			</StackPanel>
		</Grid>
		
	</Grid>
</pn:PhoneApplicationPage>